import React from 'react';

import './style/';
import {Icon, Button, message} from "antd";
import {WeaFormItem, WeaUpload, WeaDialog, WeaSearchGroup, WeaTools, WeaLocaleProvider} from "ecCom";

import {WeaMaterialLib} from 'weaPortalPublic';
const getLabel = WeaLocaleProvider.getLabel;
class Logo extends React.Component {

  state = {
      logo:"",
      visible:false,
      fileIds: [],
      fileList: [],
      isSys:"1",
      hh:"none",
      imgname:""
  }

    changeIcon = (value) => {
        this.setState({logo:value});
    }

onCancel = ()=>{
    this.getDatas();
      this.setState({visible: false});
}



    getDatas = () => {
        WeaTools.callApi('/api/portal/customlogo/getlogo','GET',{
            "id":this.props.id
        }).then((result) => {
            if(result.api_status==true&&result.isCz==true){
                this.setState({logo:result.setting.logo,isSys: result.isSys});
            }else if(result.api_status==true&&result.isCz==false){
            }
        })
    }


    saveSetting= () =>{
        WeaTools.callApi('/api/portal/customlogo/setlogo','POST',{
            jsonStr: JSON.stringify({
                "logo":this.state.logo,
                "id":this.props.id,
            })
        }).then((result) =>{
            if(result.api_status==true){
                this.setState({visible:false});
                message.success(getLabel(83551,"保存成功！"),2);
            }else {
                message.error(getLabel(84544,"保存失败！"),2);
            }
        })
        this.setState({visible: false});
    }

    openDia = () =>{
          this.setState({visible:true});
    }

    componentDidMount(){
        this.getDatas();
    }

    render() {
        const {visible,loading,isSys,logo} = this.state;
        let display ="";
        if(this.props.isSetting==false){
            display="none";
        }

        return (
            <div className="portal-container-diy-layout">
                    <div className="div-diy-icon" onClick={this.openDia}   style={{"z-index":99,"display":display}}>
                        <Icon ecId={`${this && this.props && this.props.ecId || ''}_Icon@b2ubfi`}  onClick={this.openDia} className="portal-icon-diy-layout" type="setting" theme="filled"    style={{"font-size":24,"color":"#000"}}/>
                    </div>
                <img id="logog" className="portal-com-logo" src={this.state.logo}  alt="" />
                <div style={{display: 'inline-block',height: '100%','vertical-align':'middle'}}></div>
                <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@94jzms`} visible={visible} onCancel={this.onCancel} title="LOGO设置">
                    <div style={{position:"relative",height:400}}>
                        <div>
                            <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@9u86bn`} showGroup={true}>
                                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@613pf0`} label="选择图片" labelCol={{span: 6}} wrapperCol={{span: 18}}>
                                    {
                                        this.state.logo ? (
                                            <div className="e9desktop-menu-add-img-edit">
                                                <WeaMaterialLib ecId={`${this && this.props && this.props.ecId || ''}_WeaMaterialLib@qwf9xx`}
                                                    multiCheck={false} onChange={(value)=>{ this.setState({"logo":value})}} type='button'
                                                >
                                                    <img src={logo} alt="" className="e9desktop-menu-add-img-edit-img" title="更换图标"/>
                                                </WeaMaterialLib>
                                                <div className="e9desktop-menu-add-img-edit-del" title='删除图标'>
                                                    <Icon ecId={`${this && this.props && this.props.ecId || ''}_Icon@c4qc4s`} type="cross" onClick={() => this.setState({"logo": ''})}/>
                                                </div>
                                            </div>
                                        ) : (
                                            <div className="e9desktop-menu-add-img-add">
                                                <WeaMaterialLib ecId={`${this && this.props && this.props.ecId || ''}_WeaMaterialLib@q4som5`} multiCheck={false} onChange={(value)=>{ this.setState({"logo":value})}} type='button' >

                                                    <div className="e9desktop-menu-add-img-add-icon" title= '添加图标'>
                                                        <Icon ecId={`${this && this.props && this.props.ecId || ''}_Icon@j25pu1`} type="plus"/>
                                                    </div>
                                                </WeaMaterialLib>
                                            </div>
                                        )
                                    }
                                </WeaFormItem>
                            </WeaSearchGroup>
                        </div>
                        <div style={{position:"absolute",bottom:7,"margin-left": "67%"}}>
                            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@uq7ezf`} onClick={this.saveSetting} type="primary">确认</Button>
                            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@fkh4zo`} onClick={this.onCancel} style={{"margin-left":10}}>取消</Button>
                        </div>
                    </div>
                </WeaDialog>

            </div>
        );
    }
}

export default Logo;